<template>
  <div class="headerSub">
    <van-cell title="PLAY DEFI" title-class="cell-title-large" :border="false">
      <template #right-icon>
        <img v-if="bell" class="icon-bell" src="../assets/img/icon_inform@2x.png">
<!--        <img class="icon-more" src="../assets/img/icon_more@2x.png" @click="login">-->
      </template>
    </van-cell>
  </div>

</template>
<script setup>
import {defineProps} from 'vue'
import {connect} from "../dapp";
const props = defineProps({
  bell: {
    default: false,
    type: Boolean
  }
})

async function login() {
  connect(true)
}

const bell = props.bell

</script>
<style lang="less" scoped>
  :deep(.van-cell) {
    background: #0B0C1C;
    color: #2D58E7;
    align-items: center;
    padding: 0 15px;
    height: 49px;
  }

  :deep(.cell-title-large) {
    text-align: left;
    font-size: 22px;
    font-family: D-DIN-Bold, D-DIN;
    font-weight: bold;
    color: #2D58E7;
  }

  .icon-more {
    width: 24px;
    height: 20px;
  }

  .icon-bell {
    width: 17px;
    height: 20px;
    margin-right: 20px;
  }

</style>
